<!-- 检查设备详情 -->
<template>
	<view class="page">
		<cu-custom bgColor="bg-white" :isBack="true">
			<block style="color: #777777;font-size: 48rpx;" slot="content">检查设备详情</block>
		</cu-custom>
		<scroll-view scroll-x class="bg-white nav">
			<view class="flex text-center">
				<view class="cu-item flex-sub" :class="index==TabCur?'text-orange cur':''" v-for="(item,index) in navs"
					:key="index" @tap="tabSelect" :data-id="index">
					{{item}}
				</view>
			</view>
		</scroll-view>
		<view style="margin: 20rpx 0;">
			<view class="cu-bar search bg-white">
				<view class="search-form">
					<text class="cuIcon-search"></text>
					<input @focus="InputFocus" @blur="InputBlur" :adjust-position="false" type="text"
						placeholder="请输入设备名称" confirm-type="search"></input>
				</view>
				<!-- 				<view class="action">
					<button class="cu-btn bg-system-orange shadow-blur round">搜索</button>
				</view> -->
			</view>
		</view>
		<view class="content" v-for="(item,index) in 3" :key="index">
			<view class="pd">
				<text class="title">01221一层超市前厅点型烟感</text>
				<text>地点：巡检任务</text>
				<text>设备编码：01221</text>
				<text>维保状态：已接收信号</text>
				<view class="btns-group">
					<button class="my-btn cu-btn bg-system-orange shadow" @click="see_detail(index)">测试</button>
					<button class="my-btn cu-btn bg-system-orange shadow" @click="see_detail(index)">非测试</button>
					<button class="my-btn cu-btn bg-system-orange shadow" @click="see_detail(index)">拍摄视频</button>
					<button class="my-btn cu-btn bg-system-orange shadow" @click="see_detail(index)">上报隐患</button>
				</view>

			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				TabCur: 0,
				scrollLeft: 0,
				navs: ['未检测', '已检测', '已接收信号']
			}
		},
		methods: {
			tabSelect(e) {
				this.TabCur = e.currentTarget.dataset.id;
				this.scrollLeft = (e.currentTarget.dataset.id - 1) * 60
			},
			InputBlur(e) {
				this.InputBottom = 0
			},
			see_detail(index) {
				console.info("index:" + index)
			},
			submit() {
				if (this.submitId == "" || this.address == "") {
					uni.showToast({
						title: "数据不完整"
					})
					return;
				}
				let params = {
					"location": this.address,
					"ucId": this.submitId
				}
				// 生成报警信息
				let app = getApp()
				app.globalData.request({
					url: '/wx/firealarm/confirmFire',
					data: {
						...params
					}
				}).then(function(res) {
					let data = res.data.code
					if (data == 0) {
						uni.showToast({
							title: "报警成功"
						})
						uni.navigateBack({
							delta: 2
						});
					}

				}).catch(function(e) {})
			},
		}
	}
</script>

<style scoped>
	.pd {
		background-color: #FFFFFF;
		margin: 20rpx 0;
		padding: 20rpx 0;
	}

	.pd text {
		display: flex;
		margin-left: 20rpx;
		font-size: 24rpx;
		color: #151515;
		letter-spacing: 0.39px;
		line-height: 50rpx;
	}

	.pd .title {
		font-size: 32rpx;
		color: #333333;
	}

	.btns-group {
		display: flex;
		flex-direction: row;
		justify-content: space-around;
		margin-top: 23rpx;
	}

	.btns-group button:nth-child(n+3) {
		background: #458DF5;
		box-shadow: 0 4px 14px 0 rgba(69, 141, 245, 0.50);
		border-radius: 6px;
		border-radius: 6px;
	}
</style>
